import { Button, Tooltip } from 'antd';
import pageStyles from '@/common/pageLayout.less';
import { getColorTextLoadMap, renderRegionText, tooltipLength } from '@/utils';
import { ContacterAPI } from '../common/type';
import { Fragment } from 'react';
import { EyeOutlined, EditOutlined } from '@ant-design/icons';

// 操作按钮
const Operation = (curRes: Record<string, any>, clickFnc: ContacterAPI.IOperationClick, record: Record<string, any>) => {
  let operationArray: any = [];

  let txtStyle: React.CSSProperties = {
    fontSize: '.75rem',
  };

  const Edit =
    // !!curRes['/supplierContacterController/edit'] && (record?.ownerID == null || record?.ownerID == getUserID()) ? (
    !!curRes['/supplierContacterController/edit'] ? (
      <Fragment key={record?.id + 'EditOutlined'}>
        <Button
          className="manageBtntTxtStyle"
          onClick={() => {
            clickFnc?.onEdit(record);
          }}
          type={'link'}
          size={'small'}
          icon={<EditOutlined />}
        >
          编辑
        </Button>
      </Fragment>
    ) : (
      <></>
    );

  const View = !!curRes['/supplierContacterController/getContacterById/{id}'] && (
    <Fragment key={record?.id + 'EyeOutlined'}>
      <Button
        className="manageBtntTxtStyle"
        onClick={() => {
          clickFnc?.onView(record);
        }}
        type={'link'}
        size={'small'}
        icon={<EyeOutlined />}
      >
        查看
      </Button>
    </Fragment>
  );

  /**
   * 删除联系人
   */
  // const Delete = curRes['/supplierContacterController/delete'] ? (
  //   <Fragment key={record?.id + 'DeleteOutlined'}>
  //     <Popconfirm
  //       title={<span style={{ fontWeight: 600 }}>确认要删除该联系人吗？</span>}
  //       onConfirm={(e) => {
  //         e?.stopPropagation();
  //         clickFnc?.onDelete(record);
  //       }}
  //       okType={'primary'}
  //     >
  //       <Button
  //         className='manageBtntTxtStyle'
  //         type={'link'}
  //         size={'small'}
  //         onClick={(e) => {
  //           e?.stopPropagation();
  //         }}
  //         icon={<DeleteOutlined />}
  //       >
  //         删除
  //       </Button>
  //     </Popconfirm>
  //   </Fragment>
  // ) : (
  //   <></>
  // );

  /**
   * 一个按钮都没有时展示
   */
  const Disable = (
    <Fragment key={record?.id + '--Config'}>
      <Button style={{ ...txtStyle, color: '#000' }} type={'link'} size={'small'} disabled>
        --
      </Button>
    </Fragment>
  );

  operationArray = [View, Edit];
  operationArray = operationArray?.filter((itemBtn: any) => itemBtn);
  return operationArray && operationArray?.length > 0 ? operationArray : [Disable];
};

const getTableColumns = (curRes: Record<string, any>, clickFnc: ContacterAPI.IOperationClick) => {
  return [
    {
      title: '归属供应商',
      dataIndex: 'supplierName',
      key: 'supplierName',
      width: 160,
      visible: true,
      fixed: 'left',
      unDrag: true,
      sorter: (a: any, b: any) => (a?.supplierID < b?.supplierID ? -1 : 1),
      render: (text: string | null) => {
        return (
          <Tooltip title={text ? text?.split('-')?.[0] : ''}>
            <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 150 }}>
              {text ? text?.split('-')?.[0] : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '姓名',
      dataIndex: 'fullName',
      key: 'fullName',
      width: 110,
      visible: true,
      unDrag: true,
      sorter: (a: any, b: any) => (a?.fullName < b?.fullName ? -1 : 1),
      render: (text: string | null) => {
        return (
          <Tooltip title={text ? text?.split('-')?.[0] : ''}>
            <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 120 }}>
              {text ? text?.split('-')?.[0] : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '性别',
      dataIndex: 'sex',
      key: 'sex',
      width: 70,
      visible: false,
      sorter: (a: any, b: any) => (a?.sex < b?.sex ? -1 : 1),
      render: (text: string | null) => {
        let newText = '';
        let color = '';
        if (text == '0') {
          newText = '未知';
          color = '#faad14';
        } else if (text == '1') {
          newText = '男';
          color = '#096dd9';
        } else if (text == '2') {
          newText = '女';
          color = '#fd018b';
        }
        return (
          <Tooltip title={newText ? newText : ''}>
            <span className={pageStyles['over-flow-hidden']} style={{ color: color }}>
              {newText ? newText : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '手机号码',
      dataIndex: 'phoneMobile',
      key: 'phoneMobile',
      width: 130,
      visible: true,
      sorter: (a: any, b: any) => (a?.phoneMobile < b?.phoneMobile ? -1 : 1),
      render: (text: string | null) => {
        return (
          <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 110 }}>
            {text ? text : '--'}
          </span>
        );
      },
    },
    {
      title: '办公电话',
      dataIndex: 'phoneOffice',
      key: 'phoneOffice',
      width: 150,
      visible: true,
      sorter: (a: any, b: any) => (a?.phoneOffice < b?.phoneOffice ? -1 : 1),
      render: (text: string | null) => {
        return (
          <Tooltip title={text}>
            <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 130 }}>
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '备用手机',
      dataIndex: 'phoneSpare',
      key: 'phoneSpare',
      width: 150,
      visible: true,
      sorter: (a: any, b: any) => (a?.phoneSpare < b?.phoneSpare ? -1 : 1),
      render: (text: string | null) => {
        return (
          <Tooltip title={text}>
            <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 130 }}>
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '邮箱编号',
      dataIndex: 'emailNum',
      key: 'emailNum',
      width: 150,
      visible: true,
      render: (text: string | null) => {
        return (
          <Tooltip title={text}>
            <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 130 }}>
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '所在公司',
      dataIndex: 'companyName',
      key: 'companyName',
      width: 200,
      visible: true,
      sorter: (a: any, b: any) => (a?.companyName < b?.companyName ? -1 : 1),
      render: (text: string | null) => {
        return (
          <Tooltip title={text}>
            <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 190 }}>
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '所在部门',
      dataIndex: 'deptName',
      key: 'deptName',
      width: 150,
      visible: true,
      sorter: (a: any, b: any) => (a?.deptName < b?.deptName ? -1 : 1),
      render: (text: string | null) => {
        return (
          <Tooltip title={text}>
            <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 130 }}>
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '当前职务',
      dataIndex: 'positionName',
      key: 'positionName',
      width: 150,
      visible: true,
      sorter: (a: any, b: any) => (a?.positionName < b?.positionName ? -1 : 1),
      render: (text: string | null) => {
        return (
          <Tooltip title={text}>
            <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 130 }}>
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '最高学历',
      dataIndex: 'educateLevelName',
      key: 'educateLevelName',
      width: 150,
      visible: true,
      sorter: (a: any, b: any) => (a?.educateLevel < b?.educateLevel ? -1 : 1),
      render: (text: string) => {
        let colorText = getColorTextLoadMap(text)?.colorText;
        let color = getColorTextLoadMap(text)?.color;
        return (
          <Tooltip title={colorText}>
            <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 140, color }}>
              {colorText ? colorText : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '民族',
      dataIndex: 'nationTypeName',
      key: 'nationTypeName',
      width: 150,
      visible: true,
      sorter: (a: any, b: any) => (a?.nationType < b?.nationType ? -1 : 1),
      render: (text: string) => {
        let colorText = getColorTextLoadMap(text)?.colorText;
        let color = getColorTextLoadMap(text)?.color;
        return (
          <Tooltip title={colorText}>
            <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 140, color }}>
              {colorText ? colorText : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '政治面貌',
      dataIndex: 'politicalTypeName',
      key: 'politicalTypeName',
      width: 150,
      visible: true,
      sorter: (a: any, b: any) => (a?.politicalType < b?.politicalType ? -1 : 1),
      render: (text: string) => {
        let colorText = getColorTextLoadMap(text)?.colorText;
        let color = getColorTextLoadMap(text)?.color;
        return (
          <Tooltip title={colorText}>
            <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 140, color }}>
              {colorText ? colorText : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    // {
    //   title: '是否首要',
    //   dataIndex: 'isFirst',
    //   key: 'isFirst',
    //   width: 100,
    //   visible: true,
    //   sorter: (a: any, b: any) => {
    //     if (a.isFirst < b.isFirst) {
    //       return -1;
    //     } else {
    //       return 1;
    //     }
    //   },
    //   render: (text: string, record: Record<string, any>) => {
    //     return (
    //       <>
    //         <Switch
    //           checkedChildren="是"
    //           unCheckedChildren="否"
    //           checked={text == '1' ? true : false}
    //           onChange={(checked: boolean, e: Event) => {
    //             e?.stopPropagation();
    //             // clickFnc.onSetPrimary(record, checked);
    //           }}
    //         // disabled={curRes['/smsAppController/openOrShut'] ? false : true}
    //         />
    //       </>
    //     );
    //   },
    // },
    {
      title: '所在区域',
      dataIndex: 'provinceCode',
      key: 'provinceCode',
      width: 150,
      visible: false,
      render: (text: string, record: Record<string, any>) => {
        let newText = renderRegionText(record);
        return (
          <Tooltip title={newText ? newText : ''}>
            <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 130 }}>
              {newText ? newText : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: 'QQ号码',
      dataIndex: 'qqNum',
      key: 'qqNum',
      width: 150,
      visible: false,
      render: (text: string | null) => {
        return (
          <Tooltip title={text}>
            <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 130 }}>
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '微信号码',
      dataIndex: 'wechatNum',
      key: 'wechatNum',
      width: 150,
      visible: false,
      render: (text: string | null) => {
        return (
          <Tooltip title={text}>
            <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 130 }}>
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '证件类型',
      dataIndex: 'cardTypeName',
      key: 'cardTypeName',
      width: 100,
      visible: false,
      render: (text: string) => {
        const { color, colorText } = getColorTextLoadMap(text);
        return (
          <Tooltip title={colorText}>
            <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 140, color }}>
              {colorText ? colorText : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '个人简介',
      dataIndex: 'profileInfo',
      key: 'profileInfo',
      width: 200,
      visible: false,
      render: (text: string | null) => {
        return (
          <Tooltip title={tooltipLength(text, 100)}>
            <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 190 }}>
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '住址',
      dataIndex: 'addressInfo',
      key: 'addressInfo',
      width: 200,
      visible: true,
      render: (text: string | null) => {
        return (
          <Tooltip title={tooltipLength(text, 100)}>
            <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 190 }}>
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '兴趣爱好',
      dataIndex: 'hobby',
      key: 'hobby',
      width: 200,
      visible: true,
      render: (text: string | null) => {
        return (
          <Tooltip title={tooltipLength(text, 100)}>
            <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 190 }}>
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '创建类型',
      dataIndex: 'createType',
      key: 'createType',
      width: 120,
      visible: false,
      sorter: (a: any, b: any) => (a?.createType < b?.createType ? -1 : 1),
      render: (text: string | null) => {
        let newText = '';
        if (text == '0') {
          newText = '手动创建';
        } else if (text == '1') {
          newText = 'Excel导入';
        }
        return (
          <Tooltip title={text}>
            <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 110 }}>
              {newText ? newText : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '创建时间',
      dataIndex: 'createTime',
      key: 'createTime',
      width: 150,
      visible: true,
      sorter: (a: any, b: any) => (a?.createTime < b?.createTime ? -1 : 1),
      render: (text: string | null) => {
        return (
          <Tooltip title={text}>
            <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 140 }}>
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '创建人',
      dataIndex: 'createrName',
      key: 'createrName',
      width: 150,
      visible: true,
      sorter: (a: any, b: any) => (a?.createrID < b?.createrID ? -1 : 1),
      render: (text: string | null) => {
        return (
          <Tooltip title={text}>
            <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 140 }}>
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '创建岗位',
      dataIndex: 'createPositionName',
      key: 'createPositionName',
      width: 150,
      visible: true,
      sorter: (a: any, b: any) => (a?.createPositionID < b?.createPositionID ? -1 : 1),
      render: (text: string | null) => {
        return (
          <Tooltip title={text}>
            <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 140 }}>
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '创建部门',
      dataIndex: 'createDepartmentName',
      key: 'createDepartmentName',
      width: 150,
      visible: false,
      sorter: (a: any, b: any) => (a?.createDepartmentID < b?.createDepartmentID ? -1 : 1),
      render: (text: string | null) => {
        return (
          <Tooltip title={text}>
            <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 140 }}>
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '创建公司',
      dataIndex: 'createCompanyName',
      key: 'createCompanyName',
      width: 150,
      visible: false,
      sorter: (a: any, b: any) => (a?.createCompanyID < b?.createCompanyID ? -1 : 1),
      render: (text: string | null) => {
        return (
          <Tooltip title={text}>
            <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 140 }}>
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '操作',
      dataIndex: 'operation',
      key: 'operation',
      width: 200,
      visible: true,
      unDrag: true,
      fixed: 'right',
      render: (text: any, record: any) => {
        return (
          <div
            style={{
              display: 'flex',
            }}
          >
            {Operation(curRes, clickFnc, record)}
          </div>
        );
      },
    },
  ];
};

export { getTableColumns };
